{if $modify}Modify the data{else}Add another worker{/if}

<form method="post" action="/worker/{if $modify}modify{else}add{/if}-action/">
    <input type="hidden" name="worker_id" value="{$worker.Worker_id}" />

    Select country
    <select id="country">
            <option value="0">Pick one</option>
        {foreach from=$countries item=c}
            <option value="{$c.Country_id}">{$c.Country}</option>
        {/foreach}
    </select>
    <br />

    Select county
    <select id="county">
    </select>
    <br />

    Select city
    <select id="city" name="city">
    </select>
    <br />

    <label for="first_name">First name</label>
    <input type="text" id="first_name" name="first_name" value="{$worker.First_name}" /><br />

    <label for="last_name">Last name</label>
    <input type="text" id="last_name" name="last_name" value="{$worker.Last_name}" /><br />

    <label for="email">Email</label>
    <input type="text" id="email" name="email" value="{$worker.Email}" /><br />

    <label for="phone">Phone</label>
    <input type="text" id="phone" name="phone" value="{$worker.Phone}" /><br />

    <label for="birth_date">Birth_date</label>
    <select name="birth_date_day">
        {section name=registration_day start=1 loop=32}
        <option value="{$smarty.section.registration_day.index}">{$smarty.section.registration_day.index}</option>
        {/section}
    </select>
    /
    <select name="birth_date_month">
        {section name=registration_month start=1 loop=13}
        <option value="{$smarty.section.registration_month.index}">{$smarty.section.registration_month.index}</option>
        {/section}
    </select>
    /
    <select name="birth_date_year">
        {section name=registration_year start=1900 loop=2010}
        <option value="{$smarty.section.registration_year.index}">{$smarty.section.registration_year.index}</option>
        {/section}
    </select>
    <br />


    <label for="occupation">Occupation</label>
    <input type="text" id="occupation" name="occupation" value="{$worker.Occupation}" /><br />

    <label for="sex">Sex</label>
    <select name="sex" id="sex">
        <option value="m" {if $worker.Sex eq 'm'}selected=""{/if}>M</option>
        <option value="f" {if $worker.Sex eq 'f'}selected=""{/if}>F</option>
    </select><br />

    <label for="weight">Weight</label>
    <input type="text" id="weight" name="weight" value="{$worker.Weight}" /><br />

    <label for="height">Height</label>
    <input type="text" id="height" name="height" value="{$worker.Height}" /><br />

    <label for="dimension_1">Bust</label>
    <input type="text" id="dimension_1" name="dimension_1" value="{$worker.Dimension_1}" /><br />

    <label for="dimension_2">Waist</label>
    <input type="text" id="dimension_2" name="dimension_2" value="{$worker.Dimension_2}" /><br />

    <label for="dimension_3">Hip</label>
    <input type="text" id="dimension_3" name="dimension_3" value="{$worker.Dimension_3}" /><br />

    <label for="shoe_size">Shoe size</label>
    <input type="text" id="shoe_size" name="shoe_size" value="{$worker.Shoe_size}" /><br />

    <label for="hair_color">Hair color</label>
    <input type="text" id="hair_color" name="hair_color" value="{$worker.Hair_color}" /><br />

    <label for="hair_color">Dyed Hair color</label>
    <input type="text" id="dyed_hair_color" name="dyed_hair_color" value="{$worker.Dyed_hair_color}" /><br />

    <label for="eyes_color">Eyes color</label>
    <input type="text" id="eyes_color" name="eyes_color" value="{$worker.Eyes_color}" /><br />

    <label for="activities">Activities</label>
    <div id="activities">
        <input type="checkbox" name="activity_sampling" id="activity_sampling" {if $worker.Activity_sampling}selected="selected"{/if}/><label for="activity_sampling">Activity sampling</label><br />
        <input type="checkbox" name="activity_merchandising" id="activity_merchandising" {if $worker.Activity_merchandising}selected="selected"{/if}/><label for="activity_merchandising">Activity merchandising</label><br />
        <input type="checkbox" name="activity_promotion" id="activity_promotion" {if $worker.Activity_promotion}selected="selected"{/if}/><label for="activity_promotion">Activity promotion</label><br />
        <input type="checkbox" name="activity_caravan" id="activity_caravan" {if $worker.Activity_caravan}selected="selected"{/if}/><label for="activity_caravan">Activity caravan</label><br />
        <input type="checkbox" name="activity_mistery_shopper" id="activity_mistery_shopper" {if $worker.Activity_mistery_shopper}selected="selected"{/if}/><label for="activity_mistery_shopper">Activity mistery shopper</label><br />
        <input type="checkbox" name="activity_door_to_door" id="activity_door_to_door" {if $worker.Activity_door_to_door}selected="selected"{/if}/><label for="activity_door_to_door">Activity door to door</label><br />
    </div>

    <label for="languages">Languages</label>
    <div id="languages">
        <input type="checkbox" name="language_english" id="language_english" {if $worker.Language_english}selected="selected"{/if}/><label for="language_english">Language english</label><br />
        <input type="checkbox" name="language_romanian" id="language_romanian" {if $worker.Language_romanian}selected="selected"{/if}/><label for="language_romanian">Language romanian</label><br />
        <input type="checkbox" name="language_french" id="language_french" {if $worker.Language_french}selected="selected"{/if}/><label for="language_french">Language french</label><br />
        <input type="checkbox" name="language_german" id="language_german" {if $worker.Language_german}selected="selected"{/if}/><label for="language_german">Language german</label><br />
        Other languages <input type="text" name="language_other" id="language_other" value="{$worker.Language_other}"><br />
    </div>

    <label for="pictures">Pictures</label>
    <input id="file_upload" name="file_upload" type="file" />

    <div id="pictures_container">
        <ul id="pictures_list" class="pictures_list">
            
        </ul>
    </div>

    <div id="pictures_form_container" style="display: none;"></div>

    <label for="details">Details</label>
    <textarea name="details" id="details">{$worker.Details}</textarea>

    <input type="submit" value="Save" />

</form>

<script>
$(document).ready( function()
{
    {literal}
    jQuery.fn.underlying_check_email = function( email )
    {
        var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
        if( reg.test( email ) == false ) 
        {
            return false;
        }
        else
        {
            return true;
        }
    }

    jQuery.fn.filter_check_email = function( e )
    {
        var valid = $.fn.underlying_check_email( $(this).val() );
        if ( !valid )
        {
            $(this).css( 'background-color', '#f7689e' );
        }
    }

    jQuery.fn.filter_set_ok = function ( more )
    {
        $(this).css( 'background-color', '#68f79e' );
        for ( i = 0 ; i < more.length ; i++ )
        {
            $( more[i] ).css( 'background-color', '#68f79e' );
        }
    }

    jQuery.fn.filter_check_charpool_keyup = function( charpool, obj, e )
    {
        valid = true;

        char_last = obj.val().substring( obj.val().length - 1, obj.val().length );
        if ( charpool.indexOf( char_last ) == -1  )
        {
            //obj.css( 'background-color', '#f7689e' );
            obj.val( ReplaceAll( obj.val(), char_last, '' ) );
            e.preventDefault();
        }
    }

    function ReplaceAll( Source, stringToFind, stringToReplace )
    {
        var temp = Source;
        var index = temp.indexOf( stringToFind );
        while( index != -1 )
        {
            temp = temp.replace( stringToFind, stringToReplace );
            index = temp.indexOf( stringToFind );
        }
        return temp;
    }


    {/literal}

    $('#email').blur( $.fn.filter_set_ok );
    $('#email').blur( $.fn.filter_check_email );

    $('#phone').blur( $.fn.filter_set_ok );
    $('#phone').keyup( function( e ) { $.fn.filter_check_charpool_keyup( '1234567890+', $(this), e ) } );
    
    $('#weight').numeric({ allow: '.' });
    $('#height').numeric({ allow: '.' });
    $('#dimension_1').numeric({ allow: '.' });
    $('#dimension_2').numeric({ allow: '.' });
    $('#dimension_3').numeric({ allow: '.' });
    $('#shoe_size').numeric({ allow: '.' });

    {$first_hair_color=0}
    {$first_eyes_color=0}
    $('#hair_color').autocomplete( { source: [ {foreach from=$hair_colors item=hc}{if $first_hair_color eq 1}, {else}{$first_hair_color=1}{/if}"{$hc}"{/foreach} ] } );
    $('#eyes_color').autocomplete( { source: [ {foreach from=$eyes_colors item=ec}{if $first_eyes_color eq 1}, {else}{$first_eyes_color=1}{/if}"{$ec}"{/foreach} ] } );

    $('#file_upload').uploadify(
    {
        'uploader'      : '/swf/uploadify.swf',
        'script'        : '/worker/upload_image',
        'cancelImg'     : '/images/cancel.png',
        'stuff'         : 'randomcrap',
        'auto'          : true,
        'multi'         : true,
        'onComplete'    : function(event, ID, fileObj, response, data) 
        {
            var parts = response.split( '/' );
            var uid = parts[1];
            uid = uid.split( '.' );
            uid = uid[0];

            $('<li><img id="' + uid + '" data-identifier="' + uid + '" src="/' + response + '" height="100" width="100" /></li>').appendTo( '#pictures_list' );
            $('<input type="text" />').attr( 'name', 'pictures[]' ).attr( "data-response", uid ).attr( 'value', response ).appendTo('#pictures_form_container');
            $('#' + uid ).click( function() 
            {
                var unq = $('#' + uid).attr( 'data-identifier' );
                $('[data-response=' + unq + ']').remove();
                $('#' + uid).remove();

                var p = 'image=' + response;

                $.post( 
                        '/worker/delete_image',
                        p,
                        function( s, t )
                        {
                            
                        },
                        'json'
                    );
            } );
        }
    } );

    $('#country').change( function( e )
    {
        var country = $('#country').val();
        if ( country > 0 )
        {
            $('#city > option').remove();
            var p = 'country_id=' + encodeURIComponent( country );
            $.post(
                '/location/county-list-ajax',
                p,
                function( s, t )
                {
                    if ( s['error'] == 'OK' )
                    {
                        if ( s['data']['counties'] )
                        {
                            $('#county > option').remove();

                            var option_item = $('<option></option>').val( 
                                        0 
                                        ).text( 
                                            'Pick one' 
                                        );
                            $('#county').append( option_item );   

                            for( i = 0 ; i < s['data']['counties'].length ; i++ )
                            {
                                option_item = $('<option></option>').val( 
                                        s['data']['counties'][i]['County_id'] 
                                        ).text( 
                                            s['data']['counties'][i]['County'] 
                                        );
                                $('#county').append( option_item );   
                            }
                        }
                    }
                },
                'json'
            );
        }
    } );

    $('#county').change( function()
    {
        var county = $('#county').val();
        // Extract Cities

        var p = 'county=' + encodeURIComponent( county )

        $.post( 
            '/location/city-list',
            p,
            function( s, t )
            {
                if ( s['error'] == 'OK' )
                {
                    $('#city > option').remove();

                    var option_item = $('<option></option>').val( 0 ).text( 'Pick one' );
                    $('#city').append( option_item );

                    for( i = 0 ; i < s['data']['cities'].length ; i++ )
                    {
                        option_item = $('<option></option>').val( s['data']['cities'][i]['City_id'] ).text( s['data']['cities'][i]['City'] );
                        $('#city').append( option_item );
                    }
                }
            },
            'json'
        );

    } );

    function refresh_locations()
    {
        $.post(
            '/location/list',
            '',
            function( s, t )
            {
                if ( s['error'] == 'OK' )
                {
                    $('#location_list').html( s['data']['locations_html'] );
                    locations_bind_events();
                }
            },
            'json'
        );
    }

    function locations_bind_events()
    {
        $('.location_delete').unbind();
        $('.location_delete').click( function( e )
        {
            e.preventDefault();
            var location_id = $(this).attr( 'data-id' );
            var p = 'location_id=' + location_id;

            $.post( 
                '/location/delete',
                p,
                function( s, t )
                {
                    refresh_locations();
                },
                'json'
                );
        } );
    }

    refresh_locations();    

} );
</script>